////////////////////////////////////////////////////////////////////
//                          _ooOoo_                               //
//                         o8888888o                              //
//                         88" . "88                              //
//                         (| ^_^ |)                              //
//                         O\  =  /O                              //
//                      ____/`---'\____                           //
//                    .'  \\|     |//  `.                         //
//                   /  \\|||  :  |||//  \                        //
//                  /  _||||| -:- |||||-  \                       //
//                  |   | \\\  -  /// |   |                       //
//                  | \_|  ''\---/''  |   |                       //
//                  \  .-\__  `-`  ___/-. /                       //
//                ___`. .'  /--.--\  `. . ___                     //
//              ."" '<  `.___\_<|>_/___.'  >'"".                  //
//            | | :  `- \`.;`\ _ /`;.`/ - ` : | |                 //
//            \  \ `-.   \_ __\ /__ _/   .-` /  /                 //
//      ========`-.____`-.___\_____/___.-`____.-'========         //
//                           `=---='                              //
//      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^        //
//         佛祖保佑       永无BUG     永不修改                    //
////////////////////////////////////////////////////////////////////

var appDom = document.getElementById("app");

class App extends React.Component {
    /**
     * 构造方法
     * @param props
     */
    constructor(props) {
        super(props);
        this.state = {
            controllerInfo: [],
            loading: true
        };
        this.methodContent = null;
    }

    /**
     * 渲染之前回调
     */
    componentWillMount() {

    }

    /**
     * 渲染之后
     */
    componentDidMount() {
        this.getControllerInfo();
    }

    /**
     * 获取controller信息
     */
    getControllerInfo() {
        var sta = this;
        $.ajax({
            url: "/api/getAllController",
            async: true,
            success: function (data) {
                sta.setState({
                    controllerInfo: data,
                    loading: false
                });
            },
            error: function () {
                sta.getControllerError();
            }
        });
    }

    getControllerError() {
        antd.message.error('获取controller数据失败！！！');
    }

    render() {
        return (
            <div>
                <antd.Spin spinning={this.state.loading}>
                    <antd.Layout style={{background: '#fff'}}>
                        <antd.Layout.Sider style={{background: '#fff'}} width={500}>
                            <antd.Menu mode="inline" defaultSelectedKeys={['0']}>
                                {
                                    this.state.controllerInfo.map((item, key, map) => {
                                        return (
                                            <antd.Menu.Item key={key}>
                                                <div onClick={this.controllerClick.bind(this, item)}>
                                                    <antd.Icon type="fork"/>
                                                    <span className="nav-text">
                                                        {item.key.substring(item.key.lastIndexOf(".") + 1, item.key.length)}
                                                    </span>
                                                    <span className="ControllerDesc">{item.desc}</span>
                                                </div>
                                            </antd.Menu.Item>
                                        )
                                    })
                                }
                            </antd.Menu>
                        </antd.Layout.Sider>
                        <antd.Layout.Content>
                            <div id="methodContent" className="methodContent"></div>
                        </antd.Layout.Content>
                    </antd.Layout>
                </antd.Spin>
            </div>
        )
    }

    /**
     * controller信息列表被点击
     * @param item
     * @param e
     */
    controllerClick(item, e) {
        if (this.methodContent == null) {
            this.methodContent = ReactDOM.render(<URLInfo urlKey={item.key}/>, document.getElementById("methodContent"));
        } else {
            this.methodContent.setState({
                key: item.key,
                loading: true
            });
        }
    }

}

ReactDOM.render(<App/>, appDom);